<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport"
        content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
    <title></title>
    <link rel="stylesheet" href="./css/base.css" />
    <link rel="stylesheet" href="./css/style.css" />
    <script src="./js/flexible2.0.js"></script>
    <script src="./js/vue/vue-2.6.1.min.js"></script>
    <script src="./js/vue/axios.min.js"></script>
    <link rel="stylesheet" href="./js/nutui/nutui.css" />
    <script src="./js/nutui/nutui.js"></script>
</head>

<body>
    <div class="page-gdpm">
        <div class="head-info">
            <div class="flex flex-row justify-between color-00514a f26 pt-40 px-30">
                <div>您的博饼积分：1000</div>
                <div>您的排名：100+</div>
            </div>
            <ul class="rank-type1">
                <li class="rank-1">
                    <div class="num"></div>
                    <div class="avatar"><img src="https://cdn-oss-beijing.myckjr.com/13/resource/admin-fe_lj7l_He5ptyyTC7btsd3yxDXx.jpg?x-oss-process=style/w800" /></div>
                    <div class="username">飞翔的企鹅飞翔的企鹅飞翔的企鹅飞翔的企鹅飞翔的企鹅</div>
                    <p class="point">88888</p>
                </li>
                <li class="rank-2">
                    <div class="num"></div>
                    <div class="avatar"><img src="https://cdn-oss-beijing.myckjr.com/13/resource/admin-fe_lj7l_He5ptyyTC7btsd3yxDXx.jpg?x-oss-process=style/w800" /></div>
                    <div class="username">飞翔的企鹅飞翔的企鹅飞翔的企鹅飞翔的企鹅飞翔的企鹅</div>
                    <p class="point">88888</p>
                </li>
                <li class="rank-3">
                    <div class="num"></div>
                    <div class="avatar"><img src="https://cdn-oss-beijing.myckjr.com/13/resource/admin-fe_lj7l_He5ptyyTC7btsd3yxDXx.jpg?x-oss-process=style/w800" /></div>
                    <div class="username">飞翔的企鹅飞翔的企鹅飞翔的企鹅飞翔的企鹅飞翔的企鹅</div>
                    <p class="point">88888</p>  
                </li>
            </ul>
            <p class="text-center color-00514a f24 mt-50 fw-bold">只显示前100名</p>
        </div>
        <ul class="rank-type2">
            <li>
                <div class="num">4</div>
                <div class="avatar-info">
                    <div class="pic"><img src="https://cdn-oss-beijing.myckjr.com/13/resource/admin-fe_lj7l_He5ptyyTC7btsd3yxDXx.jpg?x-oss-process=style/w800" /></div>
                    <p class="username">阿是的发送到发斯蒂芬阿斯顿发阿斯顿发阿斯顿发</p>
                </div>
                <div class="point">100</div>
            </li>
            <li>
                <div class="num">5</div>
                <div class="avatar-info">
                    <div class="pic"><img src="https://cdn-oss-beijing.myckjr.com/13/resource/admin-fe_lj7l_He5ptyyTC7btsd3yxDXx.jpg?x-oss-process=style/w800" /></div>
                    <p class="username">阿是的发送到发斯蒂芬阿斯顿发阿斯顿发阿斯顿发</p>
                </div>
                <div class="point">100</div>
            </li>
            <li>
                <div class="num">6</div>
                <div class="avatar-info">
                    <div class="pic"><img src="https://cdn-oss-beijing.myckjr.com/13/resource/admin-fe_lj7l_He5ptyyTC7btsd3yxDXx.jpg?x-oss-process=style/w800" /></div>
                    <p class="username">阿是的发送到发斯蒂芬阿斯顿发阿斯顿发阿斯顿发阿是的发送到发斯蒂芬阿斯顿发阿斯顿发阿斯顿发阿是的发送到发斯蒂芬阿斯顿发阿斯顿发阿斯顿发阿是的发送到发斯蒂芬阿斯顿发阿斯顿发阿斯顿发</p>
                </div>
                <div class="point">100</div>
            </li>
            <li>
                <div class="num">7</div>
                <div class="avatar-info">
                    <div class="pic"><img src="https://cdn-oss-beijing.myckjr.com/13/resource/admin-fe_lj7l_He5ptyyTC7btsd3yxDXx.jpg?x-oss-process=style/w800" /></div>
                    <p class="username">阿是的发送到发斯蒂芬阿斯顿发阿斯顿发阿斯顿发</p>
                </div>
                <div class="point">100</div>
            </li>
            <li>
                <div class="num">8</div>
                <div class="avatar-info">
                    <div class="pic"><img src="https://cdn-oss-beijing.myckjr.com/13/resource/admin-fe_lj7l_He5ptyyTC7btsd3yxDXx.jpg?x-oss-process=style/w800" /></div>
                    <p class="username">阿是的发送到发斯蒂芬阿斯顿发阿斯顿发阿斯顿发</p>
                </div>
                <div class="point">100</div>
            </li>
            <li>
                <div class="num">9</div>
                <div class="avatar-info">
                    <div class="pic"><img src="https://cdn-oss-beijing.myckjr.com/13/resource/admin-fe_lj7l_He5ptyyTC7btsd3yxDXx.jpg?x-oss-process=style/w800" /></div>
                    <p class="username">阿是的发送到发斯蒂芬阿斯顿发阿斯顿发阿斯顿发</p>
                </div>
                <div class="point">100</div>
            </li>
            <li>
                <div class="num">10</div>
                <div class="avatar-info">
                    <div class="pic"><img src="https://cdn-oss-beijing.myckjr.com/13/resource/admin-fe_lj7l_He5ptyyTC7btsd3yxDXx.jpg?x-oss-process=style/w800" /></div>
                    <p class="username">阿是的发送到发斯蒂芬阿斯顿发阿斯顿发阿斯顿发</p>
                </div>
                <div class="point">100</div>
            </li>
        </ul>
    </div>

</body>

</html>